<template>
	<view class="page">
		<!-- <view class="cu-bar fixed"
			style="padding:120rpx 20rpx 50rpx 20rpx;border-bottom-left-radius:38rpx;border-bottom-right-radius:38rpx;background-image:linear-gradient(to right bottom, #ff0006, #ff0035);">
			<view :style="{color : themeConfig.commonColor}" class=" margin-left-sm" @tap="tapScan()">
				<view class="cuIcon-scan" style="font-size: 45rpx;"></view>
			</view>
			<view class="search-form round flex justify-center align-center">
				<view v-if="isSearch">
					<input type="text" :focus="focus" confirm-type="search" @confirm="tapSearchName"
						:value="searchName" @input="searchNameInputChange" />
				</view>
				<view v-else class="flex justify-center align-center" @tap="tapSearch">
					<view class="cuIcon-search text-red text-bold" style="font-size: 36rpx;"></view>
					<view class="text-red">搜索设备名称/编号</view>
				</view>
			</view>
		</view> -->

		<!-- <cu-custom>
			<view class="margin-left-sm text-white" @tap="tapScan()">
				<view class="cuIcon-scan" style="font-size: 45rpx;"></view>
			</view>
			<view class="search-form round flex justify-center align-center">
				<input type="text" confirm-type="search" @confirm="searchDevice" :value="searchName"
					@input="searchNameInputChange" placeholder="搜索设备名称/编号"
					placeholder-style="color: #ff0000;text-align:center;"
					style="padding-right:0rpx;text-align:center;" />
			</view>
			<view v-if="searchName != null && searchName.lenght != 0" class="text-white">
				<button class="cu-btn bg-gradual-green round margin-right-xs" @tap="searchDevice()">搜索</button>
			</view>
		</cu-custom> -->

		<!-- style="padding-top:260rpx" -->

		<cu-custom>
			<view class="cu-bar fixed"
				:style="{'height':customBarHeight + 'px','padding-top':statusBarHeight + 'px'}">
				<view class="margin-left-sm text-white" @tap="tapScan()">
					<view class="cuIcon-scan" style="font-size: 45rpx;"></view>
				</view>
				<view class="search-form round flex justify-center align-center">
					<input type="text" confirm-type="search" @confirm="searchDevice" :value="searchName"
						@input="searchNameInputChange" placeholder="搜索设备名称/编号"
						placeholder-style="color: #ff0000;text-align:center;"
						style="padding-right:0rpx;text-align:center;" />
				</view>
				<view v-if="searchName != null && searchName.lenght != 0" class="text-white">
					<button class="cu-btn bg-gradual-green round margin-right-xs" @tap="searchDevice()">搜索</button>
				</view>
			</view>
		</cu-custom>
		
		
		<mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" :up="upOption" :safearea="true" offset="10" :top="'180rpx'"  :bottom="'10rpx'" style="position:relative;z-index:1;width:100%;">
				<view class="padding margin-xl common-box">
					<view class="text-df text-title text-bold">快速操作</view>
					<view class="flex justify-start flex-wrap text-df">
						<view v-for="(item,index) in controllerList" :key="index"
							style="width:17vw;height:17vw;border-radius:7rpx;margin-right:18rpx"
							class="flex justify-center align-center margin-top-sm unSelectStyle" @tap="selectOperate(item)">
							<view class="text-center">
								<image style="width:40rpx;height:auto" :src="`${iconBaseUrl}${item.icon}`" mode="widthFix">
								</image>
								<view class="text-xs text-gray-color" style="margin-top:2.5rpx;">
									{{item.name}}
								</view>
							</view>
						</view>
					</view>
					<!-- <view style="width:16vw;height:17vw;border-radius:7rpx"
							:class="selectControl == 'relocation' ? 'selectStyle':'unSelectStyle'"
							class="flex justify-center align-center" @tap="selectOperate('relocation')">
							<view class="text-center">
								<image style="width:40rpx;" src="@/assets/images/home/relocation.png" mode="widthFix">
								</image>
								<view :class="selectControl == 'relocation' ?'text-white':'text-gray-color'" class="text-xs"
									style="margin-top:2.5rpx;">
									重新定位
								</view>
							</view>
						</view>
					</view> -->
				</view>
				<view class="padding margin-xl common-box">
					<view class="text-df text-title text-bold margin-bottom-sm">数据统计</view>
					<view class="flex justify-evenly align-center flex-wrap">
						<view v-for="(item,index) in reportlist" :key="index" @tap='deviceSetting(item)'
							style="min-width:25%;width:25%;">
							<view class="text-black text-center">
								<view style="font-size:43rpx;" class="padding-lr-xs text-bold"
									:class="item.value > 1000 ?'text-blue-color':'text-red-color'">
									{{item.value}}
								</view>
								<view class="margin-tb-sm text-sm text-gray-color">
									{{item.name}}
								</view>
							</view>
						</view>
					</view>
				</view>
			
				<view class="padding-top padding-lr margin-xl common-box" style="margin-bottom:150rpx;position:relative">
					<view style="position:absolute;z-index:999;" class="padding-bottom">
						<view class="flex justify-between align-center">
							<view class="text-df text-title text-bold">杀虫趋势图</view>
							<view class="flex justify-end align-center" style="margin-left:170rpx;">
								<view @tap="changeShowTime" style="position:relative;">
									<view class="text-xs text-white padding-tb-xs padding-lr"
										style="background-color:#ff0000;border-top-left-radius: 6rpx;border-top-right-radius: 6rpx;"
										:style="!isShowTime ? 'border-bottom-left-radius: 6rpx;border-bottom-right-radius: 6rpx;' : ''">
										<text>{{timeList[typeIndex].name}}</text>
										<text v-if="!isShowTime" class="cuIcon-unfold margin-left-xs"></text>
										<text v-else class="cuIcon-fold margin-left-xs"></text>
									</view>
									<view v-if="isShowTime"
										style="position:absolute;top:100%;left: 0;width: 100%;background-color:#ffeff2;color:#ff0000;border-bottom-left-radius: 6rpx;border-bottom-right-radius: 6rpx;">
										<view v-for="(item,index) in unSelectTimeList" :key="index"
											class="text-xs padding-tb-xs padding-lr"
											@tap="selectTime(unSelectTimeList[index].type)">
											<text>{{unSelectTimeList[index].name}}</text>
										</view>
									</view>
								</view>
								<view @tap="changeShowTimeModal"
									class="text-xs text-white padding-tb-xs padding-lr margin-left-sm"
									style="background-color:#ff0000;border-radius: 6rpx;">
									<text>自定义</text>
								</view>
							</view>
						</view>
					</view>
					<line-chart v-if="isShowChart" :dataList="dataList" />
				</view>
		</mescroll-body>

		<view class="cu-modal bottom-modal" :class="[isDisplayModel?'show':'']" style="text-align: start;"
			:style="[{bottom:`${tabbarHeight}px`}]">
			<view class="cu-dialog bg-white">
				<view class="cu-bar bg-white">
					<view class="action text-bold">
						命令控制
					</view>
					<view class='action text-bold'>
						<view class="cuIcon-close text-grey" @tap="isDisplayModel = false"></view>
					</view>
				</view>
				<view class="margin-bottom" style="min-height: 20px;">
					<view v-for="(item,index) in currentControllerList" :key="index" class="">
						<view v-if="item.displayModel==='time_interval'">
							<!-- time_interval -->
							<view class="flex justify-end align-center flex-wrap margin-bottom-sm ">
								<view class="flex-sub flex justify-center align-center setting-border padding-xs">
									<picker :disabled="item.disabled" mode="multiSelector"
										:value="controllerMapTimeInterval[item.id] ? controllerMapTimeInterval[item.id].startTimeSlotMultiIndex : [0, 0, 0]"
										:range="startTimeSlotMultiArray"
										@change="startMultiCustomTimeSlotChange($event,item.id)">
										<view class="text-gray">
											{{controllerMap[item.id] && Array.isArray(controllerMap[item.id]) ? controllerMap[item.id][0] : '开始时间'}}
										</view>
									</picker>
									<view class="margin-left-lg margin-right-lg text-center" style="width:10%;">
										<text class="text-df">至</text>
									</view>
									<picker :disabled="item.disabled" mode="multiSelector"
										:value="controllerMapTimeInterval[item.id] ? controllerMapTimeInterval[item.id].endTimeSlotMultiIndex : [0, 0, 0]"
										:range="endTimeSlotMultiArray"
										@change="endMultiCustomTimeSlotChange($event,item.id)">
										<view class="text-gray">
											{{controllerMap[item.id] && Array.isArray(controllerMap[item.id]) ? controllerMap[item.id][1] : '结束时间'}}
										</view>
									</picker>
								</view>
								<button class="margin-lr-sm cu-btn block text-white" size="mini"
									:style="{backgroundColor: themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item)">确定</button>
							</view>
						</view>
						<view v-if="item.displayModel==='control_ratio'">
							<!-- control_ratio -->
							<view class="flex justify-end flex-wrap">
								<button v-for="(param,paramIndex) in item.commandList" :key="paramIndex"
									class="margin-right-sm margin-bottom-sm cu-btn block" size="mini"
									:class="[param.value == controllerMap[item.id] ? 'selectButton' : 'unSelectButton']"
									:style="{'--color': themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item,param.value)">{{param.name}}</button>
							</view>
						</view>
						<!-- control_btn -->
						<!-- <view v-if="item.displayModel==='control_btn'">
							<view class="flex justify-end flex-wrap">
								<button class="margin-right-sm margin-bottom-sm cu-btn block text-white" size="mini"
									:style="{backgroundColor: themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item)">确定</button>
							</view>
						</view> -->
						<view v-if="item.displayModel==='control_slider'">
							<!-- control_slider -->
							<view class="flex justify-end flex-wrap">
								<input-number class="flex-sub" :number="controllerMap[item.id]" :item="item"
									:max="parseInt(item.valueEnd)" :min="parseInt(item.valueStart)"
									@changeNumber="changeNumber"></input-number>
								<button class="margin-lr-sm margin-bottom-sm cu-btn block text-white" size="mini"
									:style="{backgroundColor: themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item)">确定</button>
							</view>
						</view>
						<view v-if="item.displayModel==='custom_btn'">
							<!-- custom_btn -->
							<view class="flex justify-end flex-wrap">
								<input v-model="controllerMap[item.id]" type="text"
									class="margin-right-sm flex-sub setting-border text-center setting-input" />
								<button class="margin-right-sm margin-bottom-sm cu-btn block text-white" size="mini"
									:style="{backgroundColor: themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item)">确定</button>
							</view>
						</view>
						<view v-if="item.displayModel==='display_time_switch'">
							<!-- display_time_switch -->
							<view class="flex justify-end align-center flex-wrap margin-bottom-sm ">
								<view
									class="flex-sub flex justify-center align-center setting-border padding-xs margin-right-sm">
									<picker :disabled="item.disabled" mode="multiSelector"
										:value="controllerMapTimeInterval[item.id] ? controllerMapTimeInterval[item.id].timeSlotMultiIndex : [0, 0, 0]"
										:range="timeSlotMultiArray" @change="multiCustomTimeSlotChange($event,item)">
										<view class="text-gray">
											{{controllerMap['time' + item.id] ? controllerMap['time' + item.id] : '00:00:00'}}
										</view>
									</picker>
								</view>
								<button v-for="(param,paramIndex) in item.commandList" :key="paramIndex"
									class="margin-right-sm cu-btn block" size="mini"
									:class="[param.value == controllerMap[item.id] ? 'selectButton' : 'noSelectButton']"
									:style="{'--color': themeConfig.primaryColor}"
									@tap.stop="comfirmClick(item,param.value)">{{param.name}}</button>
							</view>
							<view class="item-desc">
								<view class="countdown" v-if="item.running&&durations[item.id]>0">
									倒计时：{{returnHMS(durations[item.id])}}
									<view class="count-style">
										<view class="count-style-inner"
											:style="{'width':(durations[item.id]/parseInt(item.durationTotal))*100+'%','--color': themeConfig.primaryColor}">
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="cu-modal bottom-modal" :class="[isShowCmdModal?'show':'']"
			style="text-align: start;z-index:10001;">
			<view class="cu-dialog bg-white">
				<view class="cu-bar bg-white">
					<view class="action text-bold">
						命令记录
					</view>
					<view class='action text-bold'>
						<view class="cuIcon-close text-grey" @tap="isShowCmdModal = false"></view>
					</view>
				</view>
				<form>
					<view class="cu-form-group" @tap="deviceBatchCmdLog(cmdData)">
						<view class="bg-white light common-box text-sm margin padding" style="width: 100%;">
							<view class="flex justify-between padding-bottom-sm"
								style="border-bottom:1px solid rgba(0, 0, 0, 0.1);">
								<view class="text-content">
									<text class="margin-right-sm">执行命令:</text>
									<text>{{cmdData.name}}</text>
								</view>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs ">关联设备:</text>
								<text class="text-gray">{{cmdData.associationName}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs ">执行类型:</text>
								<text :style="[{color:themeConfig.primaryColor}]">{{cmdData.batchType}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs ">开始时间:</text>
								<text class="text-gray">{{cmdData.startTime}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs">完成时间:</text>
								<text class="text-yellow">{{cmdData.finishTime}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs ">执行设备数:</text>
								<text class="text-gray">{{cmdData.execCount}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs">执行成功数:</text>
								<text class="text-yellow">{{cmdData.successCount}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs">执行失败数:</text>
								<text class="text-yellow">{{cmdData.failCount}}</text>
							</view>
							<view class="margin-top-sm text-df">
								<text class="margin-right-xs">执行状态:</text>
								<text class="text-yellow">{{cmdData.status}}</text>
							</view>
						</view>
					</view>
					<button class="cu-btn bg-red block margin lg" @tap="deviceBatchCmdLog(cmdData)">
						查看
					</button>
				</form>
			</view>
		</view>

		<view class="cu-modal bottom-modal" :class="[isShowTimeModal?'show':'']"
			style="text-align: start;z-index:10001;">
			<view class="cu-dialog bg-white">
				<view class="cu-bar bg-white">
					<view class="action text-bold">
						自定义时间
					</view>
					<view class='action text-bold'>
						<view class="cuIcon-close text-grey" @tap="changeShowTimeModal"></view>
					</view>
				</view>
				<form>
					<view class="flex justify-center align-center margin margin-bottom-xl" style="height: 60rpx;">
						<picker mode="date" :value="startDate" @change='startDateChange'>
							<view class="text-grey text-df">{{ startDate }}</view>
						</picker>
						<view class="margin-left-lg margin-right-lg text-center" style="width: 25%;">
							<text class="text-df">至</text>
						</view>
						<picker mode="date" @change='endDateChange'>
							<view class="text-grey text-df">{{ endDate }}</view>
						</picker>
					</view>
					<button class="cu-btn bg-red block margin lg" @tap="confirmCustomTime">
						确认
					</button>
				</form>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		showToast,
		showLoading,
		hideLoading
	} from '@/util/toast'
	import {
		nextTick
	} from 'vue'
	import {
		formatDate
	} from '@/util/formatTime'
	import * as storage from '@/util/storage'
	import myConfig from '@/myConfig'
	import * as loginApi from '@/api/dmIot/loginApi.ts'
	import * as deviceApi from '@/api/dmIot/deviceApi.ts'
	import * as ztIotApi from '@/api/dmIot/ztIotApi.ts'
	import LineChart from '@/components/UniChars/LineChart'
	import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins';
	export default {
		name: 'MyHome',
		mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件)
		components: {
			LineChart
		},
		computed: {
			themeConfig() {
				return this.$store.state.themeConfig
			}
		},
		props: {
			param: {
				type: [Number, String, Object],
				default () {
					return null;
				}
			},
			isShowChart: {
			  type: Boolean,
			  default: false
			}
		},
		data() {
			return {
				downOption: {
					use: true,
					auto: false, //是否在初始化后,自动执行downCallback; 默认true
					native: false
				},
				upOption: {
				    use: false
				},
				iconBaseUrl: myConfig.app.iconBaseUrl,
				searchName: null,
				controllerList: [],
				controllerMap: {},
				controllerMapTimeInterval: {},
				reportlist: [],
				dataList: {},
				startDate: "",
				endDate: "",
				startTimestamp: "",
				endTimestamp: "",
				isShowTime: false,
				timeList: [{
					name: "本周",
					type: 0
				}, {
					name: "本月",
					type: 1
				}, {
					name: "本年",
					type: 2
				}],
				unSelectTimeList: [],
				typeIndex: 0,
				hasCustomType: false,
				isDisplayModel: false,
				isShowTimeModal: false,
				isShowCmdModal: false,
				cmdData: {},
				customBarHeight: storage.getCustomBarHeight(),
				statusBarHeight: storage.getStatusBarHeight(),
				tabbarHeight: storage.getTabbarHeight(),
			}
		},
		mounted() {
			this.init()
			let typeIndex = this.typeIndex
			this.unSelectTimeList = this.timeList.filter((item, index) => {
				return index != typeIndex
			})
		},
		methods: {
			init() {
				this.getInfo()
			},
			getInfo() {
				loginApi.getInfo().then((res) => {
					const {
						user,
						code,
						msg,
						success
					} = res
					if (success) {
						this.getIndexControl()
						this.getIndexReport()
						this.initDate()
						this.getLampReportTrend()
					} else {
						uni.redirectTo({
							url: `/pages/login/login`
						})
					}
				})
			},
			downCallback() {
				this.init()
				this.mescroll.endSuccess();
			},
			initDate() {
				let timestamp = new Date().getTime() / 1000
				let startTimestamp = timestamp - 7 * 24 * 60 * 60
				let endTimestamp = timestamp
				let startDate = formatDate(startTimestamp)
				let endDate = formatDate(endTimestamp)
				this.startTimestamp = startTimestamp
				this.endTimestamp = endTimestamp
				this.startDate = startDate
				this.endDate = endDate
			},
			getIndexReport() {
				ztIotApi.getIndexReport().then((res) => {
					let {
						msg,
						data,
						success
					} = res
					let {
						dayEnergy,
						deviceTotal,
						ekillCnt,
						offlineTotal,
						onlineTotal,
						reduceCo2,
						sumEKillCnt,
						sumEnergy,
					} = data
					this.reportlist = [{
							name: "总发电量",
							value: sumEnergy
						}, {
							name: "今日发电",
							value: dayEnergy
						}, {
							name: "减少碳排放",
							value: reduceCo2
						}, {
							name: "设备总数",
							value: deviceTotal
						},
						{
							name: "杀虫总数",
							value: sumEKillCnt
						}, {
							name: "在线数量",
							value: onlineTotal
						}, {
							name: "离线数量",
							value: offlineTotal
						}, {
							name: "今日杀虫数",
							value: ekillCnt
						},
					]
				})
			},
			getIndexControl() {
				ztIotApi.getIndexControl().then((res) => {
					let {
						msg,
						data,
						success
					} = res
					let controllerList = []
					this.controllerMap = {};
					this.controllerMapTimeInterval = {};
					for (let i = 0; i < data.length; i++) {
						let item = data[i]
						let params = {}
						if (item.displayModel === 'time_interval') {
							this.$set(this.controllerMapTimeInterval, item.id, {
								startTimeSlotMultiIndex: [0, 0, 0],
								endTimeSlotMultiIndex: [0, 0, 0]
							})
						}
						if (item.cmdValue && typeof(item.cmdValue) === 'string') {
							params = JSON.parse(item.cmdValue)
							if (params.value1 && !params.value2) {
								this.$set(this.controllerMap, item.id, params.value1)
							} else if (params.value1 && params.value2) {
								this.$set(this.controllerMap, item.id, [params.value1, params
									.value2
								])
							}
						}
						if (item.displayModel === 'display_time_switch') {
							if (params.time) {
								let hms = params.time.split(':')
								let date = new Date();
								let year = date.getFullYear();
								let month = date.getMonth() + 1;
								let day = date.getDate();
								let hour = parseInt(hms[0]);
								let min = parseInt(hms[1]);
								let second = parseInt(hms[2]);
								this.$set(this.controllerMap, ('time' + item.id), params.time)
								this.$set(this.controllerMapTimeInterval, item.id, {
									timeSlotMultiIndex: [hour, min, second],
								})
							}
						}
						controllerList.push(item)
					}
					this.controllerList = controllerList
				})
			},
			selectOperate(item) {
				this.currentControllerList = [item]
				if (item.displayModel !== 'control_btn') {
					//control_btn 按钮
					this.isDisplayModel = true
				} else {
					//其他
					this.isDisplayModel = false
					this.comfirmClick(item)
				}
			},
			comfirmClick(item, value) {
				if (item.running) {
					showToast("当前正在操作", "none", 2000, false)
					return;
				}
				showLoading(this.$t('loading'), true)
				this.comfirmIng = true
				let params = {
					cmdFlag: item.cmdFlag,
					param: {}, // 时间区间2个值，其他目前1个值
					type: 10
				}
				if (item.displayModel === 'time_interval') {
					//time_interval 时间区间
					if (this.controllerMap[item.id] && this.controllerMap[item.id].length === 2) {
						// console.log(this.controllerMap[item.id])
						params.param.value1 = this.controllerMap[item.id][0]
						params.param.value2 = this.controllerMap[item.id][1]
					} else {
						this.$message.error("请选择时间区间");
						return
					}
				} else if (item.displayModel === 'control_ratio') {
					//control_ratio 单选
					this.$set(this.controllerMap, item.id, value)
					params.param.value1 = this.controllerMap[item.id]
				} else if (item.displayModel === 'control_slider') {
					//control_slider 滑块
					params.param.value1 = this.controllerMap[item.id]
				} else if (item.displayModel === 'control_btn') {
					//control_btn 按钮
					params.param = {};
				} else if (item.displayModel === 'custom_btn') {
					//custom_btn 输入框
					if (!this.controllerMap[item.id]) {
						showToast("请输入内容", "none", 2000, false)
					}
					params.param.value1 = this.controllerMap[item.id]
				} else if (item.displayModel === 'display_time_switch') {
					//倒计时
					if (!this.controllerMap['time' + item.id]) {
						this.$message.error("请选择执行时长");
						return
					}
					this.$set(this.controllerMap, item.id, value)
					params.param.time = this.controllerMap['time' + item.id]
					params.param.value1 = this.controllerMap[item.id]
				}
				setTimeout(()=>{
					hideLoading()
				},1000)
				this.handleCommit(params)
			},
			handleCommit(params) {
				ztIotApi.commandInsecticidalLampDevice(params).then(res => {
					if (res.success) {
						if (res.success) {
							showToast("操作成功！", "none", 2000, false)
							this.isShowCmdModal = true
							this.cmdData = res.data.cmd
						}
					}
					setTimeout(() => {
						this.getIndexControl()
						this.isDisplayModel = false
					}, 0)
				})
			},
			changeShowTime() {
				this.isShowTime = !this.isShowTime
			},
			selectTime(type) {
				let typeIndex = this.typeIndex
				let timeList = this.timeList
				let unSelectTimeList = []
				for (var i = 0; i < timeList.length; i++) {
					let item = timeList[i]
					if (type != item.type) {
						unSelectTimeList.push(item)
					} else {
						this.typeIndex = i
					}
				}
				this.hasCustomType = false
				this.unSelectTimeList = unSelectTimeList
				this.getLampReportTrend()
			},
			changeShowTimeModal() {
				this.isShowTimeModal = !this.isShowTimeModal
			},
			startDateChange(e) {
				const date = e.detail.value
				const timestamp = (new Date(date).getTime() / 1000).toString();
				const endTimestamp = this.endTimestamp
				if (endTimestamp < timestamp || endTimestamp == timestamp) {
					showToast("请选择小于结束日期", 'none', 1000, false) //请选择小于结束日期
				} else {
					this.startDate = e.detail.value
					this.startTimestamp = timestamp
				}
			},
			endDateChange(e) {
				const date = e.detail.value
				const timestamp = (new Date(date).getTime() / 1000 + 1 * 24 * 60 * 60).toString();
				const startTimestamp = this.startTimestamp
				if (startTimestamp > timestamp || startTimestamp == timestamp) {
					showToast("请选择大于开始日期", 'none', 1000, false) //请选择大于开始日期
				} else {
					this.endDate = e.detail.value
					this.endTimestamp = timestamp
				}
			},
			confirmCustomTime() {
				this.hasCustomType = true
				this.changeShowTimeModal()
				this.getLampReportTrend()
			},
			getLampReportTrend() {
				let dataList = {}
				let hasCustomType = this.hasCustomType
				let type = this.typeIndex
				let params = {
					type
				}
				if (hasCustomType) {
					params.type = 3
					params.startDate = this.startDate
					params.endDate = this.endDate
				}
				ztIotApi.getLampReportTrend(params).then((res) => {
					// console.log("------res")
					// console.log(res)
					let {
						msg,
						data,
						success
					} = res
					let xData = []
					let yData = []
					for (let i = 0; i < data.length; i++) {
						let {
							label,
							value
						} = data[i]
						xData.push(label)
						yData.push(value)
					}
					this.dataList = {
						"xData": xData,
						"yData": yData
					}
					// this.dataList = {
					// 	"xData": ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
					// 	"yData": [150, 230, 224, 218, 135, 147, 260]
					// }
				})
			},
			deviceBatchCmdLog(item) {
				uni.navigateTo({
					url: `/pages/deviceBatchCmdLog/deviceBatchCmdLog?id=${item.id}`
				})
			},
			searchNameInputChange(e) {
				let searchName = e.detail.value.replace(/\s/g, '')
				this.searchName = searchName
			},
			searchDevice() {
				let searchName = this.searchName
				this.goToDeviceList(searchName)
			},
			goToDeviceList(param) {
				uni.$emit("navChange", "device", param)
			},
			tapScan() {
				uni.scanCode({
					success: (res) => {
						let result = res.result
						// console.log(result)
						// console.log("--------result")
						ztIotApi.bindingInsecticidalLampDevice({
							"bindingCode": result
						}).then((res) => {
							const {
								msg,
								data,
								success
							} = res
							if (success) {
								showToast("操作成功", 'none', 1000, false) //操作成功
								this.goToDeviceList()
							}
						})
					},
					fail: (res) => {
						showToast("操作失败", 'none', 1000, false) //操作失败
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.text-title {
		color: #3f3f44;
	}

	.text-red-color {
		color: #ff0000;
	}

	.text-blue-color {
		color: #335ed9;
	}

	.text-gray-color {
		color: #7f7f7f;
	}
	
	.page {
		background-color: #f4f6ff;
		min-height: 100vh;
	}

	.common-box {
		background-color: #ffffff;
	}

	.selectStyle {
		background-image: linear-gradient(to bottom right, #ff5b62, #ff0202);
	}

	.unSelectStyle {
		border: solid 2rpx transparent;
		background-image: linear-gradient(#ffeff2, #ffeff2),
			linear-gradient(to right bottom, #ffeff2 0%, #ffd2d5 50%, #ffeff2 100%);
		background-origin: border-box;
		background-clip: content-box, border-box;
	}

	.selectButton {
		color: #fff;
		background-image: linear-gradient(to bottom right, #ff5b62, #ff0202);
	}

	.unSelectButton {
		color: #8799a3;
		background-color: #efefef
	}
</style>
